<template>
  <el-dialog
    title="选择理赔记录"
    :visible.sync="dialogTableVisible"
    width="80%"
  >
    <el-form :model="dataForm" label-width="150px">
      <el-row type="flex" justify="start">
        <el-form-item label="案件编号:">
          <el-input v-model="dataForm.caseNo" disabled></el-input>
        </el-form-item>
        <el-form-item label="企业名称:" disabled>
          <el-input v-model="dataForm.corpName" disabled></el-input>
        </el-form-item>
      </el-row>
      <el-row type="flex" justify="start">
        <el-form-item label="出险人姓名:" disabled>
          <el-input v-model="dataForm.insuredName" disabled></el-input>
        </el-form-item>
        <el-form-item label="证件号码:" disabled>
          <el-input v-model="dataForm.certificateNo" disabled></el-input>
        </el-form-item>
      </el-row>
    </el-form>
    <el-table :data="gridData" border style="width: 100%">
      <el-table-column type="index" label="序号" width="60"> </el-table-column>
      <el-table-column property="id" label="理赔记录编号" width="150">
        <template slot-scope="scope">
          {{ dataForm.caseNo }}-{{ scope.row.settlementOrder }}
        </template>
      </el-table-column>
      <el-table-column property="name" label="保单号" width="200">
        <template slot-scope="scope">
          {{ dataForm.policyNo }}
        </template>
      </el-table-column>
      <el-table-column property="address" label="报案时间" width="180">
        <template slot-scope="scope">
          {{ dataForm.reportTime }}
        </template>
      </el-table-column>
      <el-table-column property="caseStatus" label="状态" width="150">
        <template slot-scope="scope">
          <div v-for="item in Consts.firstStatusList" :key="item.value">
            <el-tag v-if="item.value == scope.row.caseStatus">
              {{ item.label }}
            </el-tag>
          </div>
        </template>
      </el-table-column>
      <el-table-column
        property="acceptorName"
        label="理赔专员"
      ></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            type="primary"
            size="mini"
            @click="goCaseDetail(scope.row)"
            >查看
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      gridData: [],
      dataForm: {
        id: "",
        caseNo: "",
        corpName: "",
        insuredName: "",
        certificateNo: "",
        policyNo: "",
        reportTime: "",
      },
      dialogTableVisible: false,
    };
  },
  methods: {
    init: function (params) {
      params = JSON.parse(params);
      this.dataForm = params;
      this.$http({
        url: this.$http.adornUrl("/claim/claimsettlement/list4case?"),
        method: "post",
        contentType: "form",
        params: this.$http.adornParams({
          caseId: params.id,
        }),
      }).then(({ data }) => {
        this.dialogTableVisible = true;
        if (data && data.code === 0) {
          if(data.data.length == 1){
            this.goCaseDetail(data.data[0]);
          }
          this.gridData = data.data;
        }
      });
    },
    goCaseDetail: function (obj) {
      this.dialogTableVisible = false;
      this.$router.push({ name: "case-detail-tab", query: { id: obj.id } });
    },
  },
};
</script>

<style>
</style>
